@import (reference) '../../static/style/config.less';
@import (reference) '../../static/style/set1Px.less';

@lotusLoading: lotus-loading;
.@{lotusLoading} {
  &-wrap {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    background: rgba(255, 255, 255, 0);
    .flex();
    .flex-hvc();
  }
	&-text{
		color:#fff;
		font-size: 24rpx;
	}
  &-inner{
		width:146rpx;
		height:146rpx;
    border-radius: 10rpx;
    text-align: center;
    background: rgba(0, 0, 0, .65);
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%,-50%);
    .flex();
    .flex-hvc();
  }
  &-img{
    display: block;
    background: transparent url() no-repeat;
    background-size: 100%;
    animation: lotusLoading 1s steps(12, end) infinite;
    width:62rpx;
		height:62rpx;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 6rpx;
  }
  @-webkit-keyframes lotusLoading {
    0% {
      -webkit-transform: rotate3d(0, 0, 1, 0deg);
      transform: rotate3d(0, 0, 1, 0deg);
    }
    100% {
      -webkit-transform: rotate3d(0, 0, 1, 360deg);
      transform: rotate3d(0, 0, 1, 360deg);
    }
  }
  @keyframes lotusLoading {
    0% {
      -webkit-transform: rotate3d(0, 0, 1, 0deg);
      transform: rotate3d(0, 0, 1, 0deg);
    }
    100% {
      -webkit-transform: rotate3d(0, 0, 1, 360deg);
      transform: rotate3d(0, 0, 1, 360deg);
    }
  }
}